<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="">
	<meta name="keywords" content="">
	<meta name="author" content="Steper Kuo">
	<title>Demo: Theme header</title>

	<!-- Favicons -->
	<link rel="apple-touch-icon" sizes="152x152" href="../../assets/img/apple-icon-152x152.png">
	<link rel="icon" type="image/png" sizes="16x16" href="../../assets/img/favicon-16x16.png">

	<!-- Link Demo *** CSS -->
	<link type="text/css" rel="stylesheet" href="owl.css">

	<!--Jquery.js, HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
	<script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
	<!--[if lt IE 9]>
	<script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
	<![endif]-->

</head>
<body>

<!-- Script Preload code *** JS -->
<script src="https://gyx8899.github.io/YX-WebThemeKit/fn-pre-loader/preLoader.min.js?type=split-ssc"></script>

<!-- Script Fundebug code *** JS -->
<script src="https://js.fundebug.cn/fundebug.0.3.6.min.js"
				apikey="f3b60739271056d85641a316cd13350f5960922b510427e3ec514bc3f0a74ac5"></script>

<!-- header -->
<header class="header">
	<div class="row">
		<div class="large-12 columns">
			<div class="brand left">
				<h3>
					<a href="">{{title}}</a>
				</h3>
			</div>
			<a id="toggle-nav" class="right">
				<span></span> <span></span> <span></span>
			</a>
			<div class="nav-bar">
				<ul class="clearfix">
					<!--<li><a href="/index.html">Home</a></li>-->
					{{menuItems}}
				</ul>
			</div>
		</div>
	</div>
</header>

<!--  Demos -->
<main>
	<!-- title -->
	<section class="title">
		<div class="row">
			<div class="large-12 columns">
				<a href="/">Title</a>
			</div>
			<div class="large-12 columns">
				<h1>subTitle</h1>
			</div>
		</div>
	</section>
</main>

<!-- footer -->
<footer class="footer">
	<div class="row">
		<div class="large-12 columns">
			<h5>
				<img class="avatar" data-image="{{path}}owl/images/avatar.jpg" alt="avatar">
				<a href="{{authorLink}}">{{author}}</a>
			</h5>
		</div>
	</div>
</footer>

<!-- Script Common *** JS -->
<script src="https://gyx8899.github.io/YX-JS-ToolKit/dist/assets/js/common.min.js"></script>

<!-- Script Config *** JS -->
<!--<script src="https://gyx8899.github.io/YX-WebThemeKit/assets/js/yx-theme-config.min.js"></script>-->
<script src="https://gyx8899.github.io/YX-WebThemeKit/assets/js/yx-theme-config.min.js"></script>
<!--<script src="../../assets/js/yx-theme-config.js"></script>-->

<!-- Script Theme *** JS -->
<!--<script src="../headerFooter.js"></script>-->

</body>
</html>